<template>
    <div class="GO-copy-list">
        <div class="w w-box list-box">
            <div class="search-from">
                <el-date-picker v-model="searchDate" class="search-date" type="date" placeholder="选择日期"> </el-date-picker>
                <el-input v-model="searchKeyword" class="search-keyword" placeholder="请输入订单编号、客户姓名、手机号或订单名称"></el-input>
                <el-button @click="show_myorderlist">查询</el-button>
            </div>
            <!--我的模版列表 start-->
            <div class="order-table">
                <el-table :data="orderTable" style="width: 100%">
                    <el-table-column prop="id" label="序号" width="100" align="center"></el-table-column>
                    <el-table-column prop="orderSn" label="订单编号" align="center"></el-table-column>
                    <el-table-column prop="createTime" label="创建时间" align="center"></el-table-column>
                    <el-table-column prop="customerName" label="顾客名称" align="center"></el-table-column>
                    <el-table-column prop="customerCode" label="顾客编码" align="center"></el-table-column>
                    <el-table-column prop="storeName" label="下单门店" align="center"></el-table-column>
                    <el-table-column prop="realName" label="下单员工" align="center"></el-table-column>
                    <el-table-column prop="createTime" label="保存时间" align="center"></el-table-column>
                    <el-table-column prop="operate" label="操作" width="100" align="center">
                        <template slot-scope="props">
                            <div class="operate-btn">
<!--                                <el-popconfirm confirm-button-text="确认" cancel-button-text="取消" icon="el-icon-warning" icon-color="#FAAD12" @onConfirm="deleteOrderFun(props.row, 4)" title="确定删除该条记录？">-->
<!--                                    <el-button slot="reference" type="text" size="small">删除</el-button>-->
<!--                                </el-popconfirm>-->
                                <el-popconfirm confirm-button-text="确认" cancel-button-text="取消" icon="el-icon-warning" @onConfirm="copy_singleorder(props.row.orderSn)" title="确定复制该订单信息吗？">
                                    <el-button slot="reference" size="small" type="text">复制订单信息</el-button>
                                </el-popconfirm>
                            </div>

                        </template>
                    </el-table-column>
                </el-table>
            </div>
            <!--我的模版列表 end-->
            <el-pagination style="float: right;margin-right: 10px;margin-top: -35px" v-if="orderTable.length" background layout="prev, pager, next" :total="orderTotal" :current-page.sync="orderPageNo" :page-size="orderPageSize" @current-change="orderChangePage"></el-pagination>
        </div>
    </div>
</template>

<script>
    let storage = window.localStorage;
    import {query_mycopySingleorderlist,copy_single_order } from '@/api/group-order';
    export default {
        name: 'copy-list',
        data() {
            return {
                searchDate: '',
                searchKeyword: '',
                orderTable: [],
                orderTotal: 0,
                orderPageNo: 1,
                orderPageSize: 10
            };
        },
        created() {
            this.getMyOrderList();
        },
        methods: {
            show_myorderlist(){
                this.orderPageNo=1;
                this.orderTable=[];
                this.getMyOrderList();
            },
            /**
             * @Date: 2020-11-07 21:08:25
             * @LastEditors: qwguo
             * @description: 获取数据方法
             * @param {type} 参数说明
             * @return: 返回值
             */
            getMyOrderList() {
                let that = this;
                query_mycopySingleorderlist({
                    token: storage.getItem('token'),
                    pageNo: that.orderPageNo,
                    queryTime: that.searchDate,
                    queryName: that.searchKeyword
                }).then(res => {
                    if (res.status == 200 && res.data.code == 0) {
                        that.loaded = true;
                        let getData = res.data.data;
                        getData.records.forEach(v => {
                            that.orderTable.push(v);
                        });
                    }
                });
            },
            /**
             * @Date: 2020-11-07 21:08:25
             * @LastEditors: qwguo
             * @description: 复制订单/再来一单
             * @param {type} 参数说明
             * @return: 返回值
             */
            copy_singleorder(ordersn) {
                        copy_single_order({
                            token: storage.getItem('token'),
                            orderSn:ordersn
                        }).then(res => {
                            if (res.status == 200 && res.data.code == 0) {
                                this.$message.success("复制订单成功！")
                                this.orderPageNo=1;
                                this.orderTable=[];
                                this.getMyOrderList();
                            }else {
                                this.$message.error(res.data.msg)
                            }
                        });

            },
            /**
             * @Date: 2020-11-07 21:08:09
             * @LastEditors: qwguo
             * @description: 更改页码
             * @param {type} 参数说明
             * @return: 返回值
             */
            orderChangePage(index) {
                this.orderPageNo = index;
            }
        }
    };
</script>

<style lang="scss">
    .GO-copy-list {
        .list-box {
            margin-top: 30px;
        }
        .search-from {
            padding: 20px;
            .search-date {
                width: 150px;
            }
            .search-keyword {
                width: 400px;
                margin: 0 10px;
            }
        }
        .order-table {
            margin: 0 20px;
            padding: 0 0 50px;
            thead {
                th {
                    background-color: #3c3c3c;
                    color: #fcec83;
                    border-right: 1px solid #fff;
                }
            }
            tbody {
                td {
                    background-color: #f9f9f9;
                    border-right: 1px solid #fff;
                }
            }
        }
    }
</style>
